<template>
    <div>
        <el-input v-model="vo.username" placeholder="用户名" style="width:223px"></el-input>
        
            <el-date-picker
      v-model="vo.datebegin"
      type="date"
      placeholder="选择日期时间">
    </el-date-picker>
    ~
        <el-date-picker
      v-model="vo.dateend"
      type="date"
      placeholder="选择日期时间">
    </el-date-picker>
         <el-button v-on:click="searchQy()">查询</el-button>
          <el-button @click="newZh">新加</el-button>
          <el-button @click="deleteBY()">批量删除</el-button>
          


          <el-table
    :data="tableData"
    border
    style="width: 100%" @selection-change="handleSelectionChange">
    <el-table-column type="selection" width="55"></el-table-column>
       <el-table-column
      prop="id"
      label="主键"
      width="300">
    </el-table-column>

    <el-table-column
      fixed
      prop="name"
      label="姓名"
      width="150">
    </el-table-column>
    <el-table-column
      prop="sex"
      label="性别"
      width="120">
    </el-table-column>
    <el-table-column
      prop="classid"
      label="班级"
      width="120">
    </el-table-column>
    <el-table-column
      prop="createdt"
      label="入学时间"
      width="120">
    </el-table-column>
 
    
    <el-table-column
      fixed="right"
      label="操作"
      width="100">
      <template slot-scope="scope">
        <el-button @click="handleCQ(scope.row)" type="text" size="small">修改</el-button>
        <el-button @click="handleDelete(scope.row)" type="text" size="small">删除</el-button>
       
        
      </template>
    </el-table-column>
  </el-table>

  <el-pagination
    layout="prev, pager, next"
    
    :current-page="currentpage"
    :page-size="pagesize"
    :total="totalsize"
    @current-change="changepage"
    >
  </el-pagination>


<el-dialog title="新开户" :visible.sync="dialogFormVisible">
  <el-form :model="form">

    <el-form-item label="主键" :label-width="formLabelWidth">
      <el-input v-model="form.id" autocomplete="off" disabled="true"></el-input>
    </el-form-item>

    <el-form-item label="名称" :label-width="formLabelWidth">
      <el-input v-model="form.name" autocomplete="off"></el-input>
    </el-form-item>

    <el-form-item label="性别" :label-width="formLabelWidth">
    <template>
  <el-radio v-model="form.sex" label="1">男</el-radio>
  <el-radio v-model="form.sex" label="2">女</el-radio>
</template>

    </el-form-item>

      <el-form-item label="班级" :label-width="formLabelWidth">
      <el-select v-model="form.classid" placeholder="请选择">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
  </el-select>
    </el-form-item>
<el-form-item label="创建时间" :label-width="formLabelWidth">
   <el-date-picker
      v-model="form.createdt"
      type="date"
      placeholder="选择日期">
    </el-date-picker>

    </el-form-item>

  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="addXKH">确 定</el-button>
  </div>
</el-dialog>

    </div>
</template>

<script>
import axios from 'axios';

export default {

// 页面初始化过程中 ，从服务器端获取我么数据刷新到页面
  created () {
    //直接调用分页查询数据
    this.searchQy();
    
  },

// 方法的脚本
    methods: {
      //批量删除函数
      handleSelectionChange(vals){

        this.delRows = vals ;
        alert(tthis.delRows);

      },
      deleteBY(){
     
              let ids = this.delRows.map(item => item.id);
                 axios.post(this.$baseUrl +'/weekstudent/deleteAll' , ids).then(res=>{
            this.searchQy();

         })

              
      },

changepage(cp){
  this.currentpage = cp ;
  this.searchQy(this.currentpage);

},
        searchQy(currentpage = 1){
          // 进行权限初始化
             this.currentpage = currentpage;
            
             
             
               axios.post(this.$baseUrl +'/weekstudent/searchzk/'+ this.currentpage+"/"+this.pagesize , this.vo).then(res=>{
                   
                this.tableData =  res.data.rows;
                this.totalsize = res.data.total;

           // this.search();

         })

        
        //  axios.post('http://localhost:8089/taccount/searchFy1/'+this.currentpage+"/" +this.pagesize,this.vo)
         // .then(res=>{
          //  this.tableData =  res.data.rows;
           // this.totalsize = res.data.total;

          //})
        


        },

    
       
        addXKH(){

          let zhujian =  this.form.id ;
          

          if(zhujian != null){
            
         axios.put('http://127.0.0.1:8089/weekstudent/putwk' , this.form)
         .then(res=>{
            this.dialogFormVisible = false ;
            this.searchQy();
           

         })
         
          }
          else{
          
            
         axios.post('http://127.0.0.1:8089/weekstudent/addAccount1' , this.form)
         .then(res=>{
            this.dialogFormVisible = false ;
          this.searchQy();
          

         })

          }

        
    //        alert(  this.form.createdt);
    //    this.dialogFormVisible = false ;
        },
  
        // 分页的事件
        changePagenum(cp=1){

          this.currentpage = cp ;
         axios.post('http://127.0.0.1:8089/weekstudent/searchzk/'+ this.currentPage+"/" + this.pageCount , this.vo)
         .then(res=>{
            this.tableData = res.data.rows ;
            this.totalrows= res.total;

            
           // this.search();

         })


         

        },
         
         

        //删除
        handleDelete(row){
          let useid = row.id ;
          

 axios.post('http://127.0.0.1:8089/weekstudent/delete/'+ useid)
         .then(res=>{
            this.tableData = res.data.rows ;
            this.totalrows= res.total;
            this.searchQy();

         })

        },
        handleCQ(row){
            // 赋值 获取我们的账号信息 ，让账号信息给form 表单
            this.form = row;
            this.dialogFormVisible = true ;
           
        },
       
        searchTj(){
            axios.post('http://127.0.0.1:8089/taccount/searchFy1/'+ this.currentpage+"/" + this.pageCount , this.vo)
         .then(res=>{
            this.tableData = res.data.rows ;
            this.totalrows= res.total;

            
           // this.search();

         })
         
           
        },
         newZh(){
             
             this.form.id = null ;
             this.dialogFormVisible =true ;

         }
        
    },
   


// 页面数据的初始化 对象
    data() {
    return {
         options: [{
          value: '1',
          label: '大一'
        }, {
          value: '2',
          label: '大二'
        }],
        //批量删除的主键值
        delRows:[],
        //page 

        currentpage:1, 
        pagesize:2,  
        totalsize:100,
        //银行刘水初始化数据
        gridData: [{
          aid: '2016-05-02',
          taccountid: '王小虎',
          bemoney: '上海市普陀区金沙江路 1518 弄',

        }],
      vo:{},
      tableData: [],
        dialogFormVisible:false,
      
      
        form: {
          name: '',
          sex: '',
          createdt: '',
          classid:"",
        
          totaccountid:"",
          toname:"",


        },

    }
  }
    
}
</script>